<%@page language="java" pageEncoding="utf-8" %>
<!DOCTYPE html>
<html lang="en">
  <!-- [Head] start -->
  <head>
    <title>Login | Berry Bootstrap 5 Admin Template</title>
    <!-- [Meta] -->
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta
      name="description"
      content="Berry is made using Bootstrap 5 design framework. Download the free admin template & use it for your project."
    />
    <meta name="keywords" content="Berry, Dashboard UI Kit, Bootstrap 5, Admin Template, Admin Dashboard, CRM, CMS, Bootstrap Admin Template" />

    <!-- [Favicon] icon --><link rel="icon" href="/myhouse/static/mediator/images/favicon.svg" type="image/x-icon" />
 <!-- [Google Font] Family -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap" id="main-font-link" />
<!-- [Tabler Icons] https://tablericons.com -->
<link rel="stylesheet" href="/myhouse/static/mediator/fonts/tabler-icons.min.css" />
<!-- [Material Icons] https://fonts.google.com/icons -->
<link rel="stylesheet" href="/myhouse/static/mediator/fonts/material.css" />
<!-- [Template CSS Files] -->
<link rel="stylesheet" href="/myhouse/static/mediator/css/style.css" id="main-style-link" />
<link rel="stylesheet" href="/myhouse/static/mediator/css/style-preset.css" id="preset-style-link" />

  </head>
  <!-- [Head] end -->
  <!-- [Body] Start -->
  <body>
    <!-- [ Pre-loader ] start -->
    <div class="loader-bg">

      <div class="loader-track">
        <div class="loader-fill"></div>
      </div>
    </div>
    <!-- [ Pre-loader ] End -->

    <div class="auth-main">
      <div class="auth-wrapper v3">
        <div class="auth-form">
          <div class="card my-5">
            <div class="card-body">
              <a href="#" class="d-flex justify-content-center">
                <img src="/myhouse/static/mediator/images/logo-dark.svg" />
              </a>
              <div class="row">
                <div class="d-flex justify-content-center">
                  <div class="auth-header">
                    <h2 class="text-secondary mt-5"><b>您好，欢迎回来</b></h2>
                  </div>
                </div>
              </div>
    <form method="get" id="myform">
      <div class="form-floating mb-3">
        <span id="myspan"></span>
        <input type="text" class="form-control" id="mediatorName" name="mediatorName" />
        <label>用户名</label><span id="name"></span>
      </div>
      <div class="form-floating mb-3">
        <input type="password" class="form-control" id="mediatorPass" name="mediatorPass" />
        <label>密码</label><span id="pass"></span>
      </div>
      <input type="text" class="form-control" placeholder="验证码" id="textYzm">
      <span id="verify"></span>
      <br>
      <img src="/myhouse/mediator/captcha" id="yzm">
      <br><br>
      <span><a href="/myhouse/mediator/register">没有用户？去注册！</a></span>
      <div class="d-grid mt-4">
        <input type="button" value="登录" class="btn btn-secondary">
      </div>
    </form>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- [ Main Content ] end -->
    <!-- Required Js -->
    <script src="/myhouse/static/mediator/js/plugins/popper.min.js"></script>
    <script src="/myhouse/static/mediator/js/plugins/simplebar.min.js"></script>
    <script src="/myhouse/static/mediator/js/plugins/bootstrap.min.js"></script>
    <script src="/myhouse/static/mediator/js/config.js"></script>
    <script src="/myhouse/static/mediator/js/pcoded.js"></script>
  </body>
</html>
<script type="text/javascript" src="/myhouse/static/mediator/js/jquery-3.2.1.min.js"></script>
<script type="text/javascript">
  $(function (){
    $("#mediatorName").blur(verifyName);
    $("#mediatorPass").blur(verifyPass);
    $(".btn").click(verifyAll);
  });

  function verifyAll(){
    var name = $("#mediatorName").val();
    var pass = $("#mediatorPass").val();
    $.ajax({
      url:"/myhouse/mediator/mediatorLogin",
      type:"post",
      async:false,
      data:{mediatorName:name,mediatorPass:pass},
      success:function (mes){
        if (mes == "1"){
          if (flag){
            location.href = "/myhouse/mediator/index";
          }
        }else if(mes == "0") {
          $("#myspan").html("用户名或密码错误");
          $("#myspan").css("color","red");
        }
      }
    });
  }

function verifyName(){
  var reg = /^[\u4e00-\u999ffffA-Za-z0-9_]{2,10}$/;
  var name = $("#mediatorName").val()
  if (reg.test(name) && name != ""){
    $("#name").html("√");
    $("#name").css("color","green");
    return true;
  }else {
    $("#name").html("×");
    $("#name").css("color","red");
    return false;
  }
}
function verifyPass(){
  var reg = /^\w{6,8}$/;
  var pass = $("#mediatorPass").val();
  if (reg.test(pass)){
    $("#pass").html("√");
    $("#pass").css("color","green");
    return  true;
  }else {
    $("#pass").html("×");
    $("#pass").css("color","red");
   return false;
  }
}
</script>
<script type="text/javascript">//验证码换图片
  $(function (){
    $("#yzm").click(function (){
      $("#yzm").attr("src","/myhouse/mediator/captcha?x="+Math.random())
    });
  });
</script>



<script type="text/javascript">
  $(function (){
    $("#textYzm").blur(checkCheckCode);
  });
  var flag;
  function checkCheckCode()
  {
    var inputCode = $("#textYzm").val();//输入
    $.ajax({
      url:"/myhouse/mediator/check",
      type:"get",
      async:false,
      data:{inputCode:inputCode},
      success:function(mes){
        if (mes == "1"){
          $("#verify").text("√");
          $("#verify").css("color","green");
          flag = true;
        }else if (mes == "0") {
          $("#verify").text("×");
          $("#verify").css("color","red");
          flag = false;
        }
      }
    });
  }
</script>